function era_total_count() {
    showTableAndEcharts();
    stopColor();
    isFlag = true;
    //查询所有数据
    $.ajax({
        method: "POST",
        url: "earTotalCount",
        success: function (data) {
            var jsonArr = JSON.parse(data);

            //加载数据到表格中
            init_era_total_table(jsonArr);
            //加载数据到图表中
            //添加图表对应的容器
            $("#dataEcharts div:gt(0)").remove();
            $("#dataEcharts").append('<div id="era_total" class="col-sm-6"></div>');
            $("#dataEcharts").append('<div id="era_total2" class="col-sm-6"></div>');
            init_era_total_echarts(jsonArr, "era_total", "era_total2");
        }
    });
}

//加载数据到表格
function init_era_total_table(jsonArr) {
    //重置提示
    $("#tip").html("<h3>各年代操作量统计表格</h3>");
    $("#echart-tip").html("<h3>各年代操作量统计图表</h3>");

    //重置表头
    $("#head-tr").empty();
    //重新添加表头
    $("#head-tr").append("<th>ID</th><th>年代</th><th>总操作量</th>");

    //重置表的数据
    $("tbody").empty();
    $.each(jsonArr, function (index, totalCount) {
        if (index % 2 == 0) {
            $("tbody").append("<tr class='active'><td>"+totalCount.id+"</td><td>"+totalCount.era+"</td><td>"
                +totalCount.count+"</td></tr>")
        } else {
            $("tbody").append("<tr class='info'><td>"+totalCount.id+"</td><td>"+totalCount.era+"</td><td>"
                +totalCount.count+"</td></tr>")
        }
    });

    $("tbody tr").on("mouseenter", this, function() {
        color = $(this).attr("class");
        $(this).removeClass(color);
        $(this).addClass("success");
    });
    $("tbody tr").on("mouseleave", this, function() {
        $(this).removeClass("success");
        $(this).addClass(color);
    });
}

//记载数据到表格
function init_era_total_echarts(jsonArr, id, id2) {
    var all_data = [];
    var x_data = [];
    var y_data = [];
    $.each(jsonArr, function (index, totalCount) {
        all_data.push(
            {
                value: totalCount.count,
                name: totalCount.era + "后"
            }
        );
        x_data.push(totalCount.era);
        y_data.push(totalCount.count);
    });

    var eraTotal = echarts.init(document.getElementById(id));
    var option = {
        title: {
            text: '各年龄段用户总操作量',
            left: 'center',
        },
        tooltip: {
            trigger: 'item',
            formatter: '{a} <br/>{b}: {c} ({d}%)'
        },
        legend: {
            top: '8%',
            left: 'center'
        },
        series: [{
            name: '各年龄段用户总操作量',
            type: 'pie',
            radius: ['40%', '80%'],
            center: ['50%', '56%'],
            avoidLabelOverlap: false,
            label: {
                show: false,
                position: 'center'
            },
            emphasis: {
                label: {
                    show: true,
                    fontSize: '40',
                    fontWeight: 'bold'
                }
            },
            labelLine: {
                show: false
            },
            data: all_data
        }]
    };
    eraTotal.setOption(option);
    eraTotal.resize({
        width: 600,
        height: 400
    });

    var eraTotal2 = echarts.init(document.getElementById(id2));
    option2 = {
        xAxis: {
            type: 'category',
            data: x_data
        },
        yAxis: {
            type: 'value'
        },
        series: [
            {
                data: y_data,
                type: 'bar'
            }
        ]
    };
    eraTotal2.setOption(option2);
    eraTotal2.resize({
        width: 600,
        height: 400
    });
}